<template>
    <!--订单列表-->
    <div class="order">
        <avue-crud ref="crud"
                   v-model="form"
                   :page="page"
                   :data="tableData"
                   :table-loading="tableLoading"
                   :option="tableOption"
                   @on-load="getList"
                   @search-change="searchChange"
                   @refresh-change="refreshChange"
                   @size-change="sizeChange"
                   @current-change="currentChange"
                   @row-update="handleUpdate"
                   @row-save="handleSave"
                   @row-del="rowDel">
            <template slot="menu" slot-scope="scope">
                <el-button :size="scope.size" icon="el-icon-view" type="text" @click="$refs.infoDia.openDia(scope.row.id)" >订单详情</el-button>
                <el-button :size="scope.size" type="text" @click="routeView(scope.row)"><i class="fa fa-rocket"></i><span  style="margin-left: 5px">配送路线</span></el-button>
                <el-button :size="scope.size" icon="el-icon-check" type="text" v-if="scope.row.state=='01'"  @click="startDelivery(scope.row.id)">开始配送</el-button>
                <el-button :size="scope.size" icon="el-icon-check" type="text" v-if="scope.row.state=='02'"  @click="deliveryOk(scope.row.id)">确认送达</el-button>
            </template>
        </avue-crud>
        <infoDia ref="infoDia"></infoDia>
        <route ref="route"></route>
    </div>
</template>

<script>
    import tableMixins from "@/mixins/tableMixins.vue"
    export default {
        name: "order",
        components: {
            'infoDia': () => import('@/components/order/infoDia.vue'),
            'route': () => import('@/components/map/route.vue'),
        },
        mixins: [tableMixins],
        data() {
            return {
                //访问接口前缀
                url: "info-order",
                //查询url
                listUrl: 'findPageByMerchants',
                // 表格参数
                tableOption: {
                    border: true,
                    index: true,
                    indexLabel: '序号',
                    indexWidth: 50,
                    stripe: true,
                    align: 'center',
                    searchMenuSpan: 6,
                    labelWidth: 120,
                    height: '600px',
                    calcHeight: 400,
                    dialogWidth: 900,
                    menuWidth: 300,
                    menuAlign: 'center',
                    addBtn:false,
                    editBtn:false,
                    delBtn:false,
                    column: [
                        {
                            prop: 'id',
                            label: 'ID',
                            hide: true,
                            addDisplay: false,
                            editDisplay: false
                        },
                        {
                            prop: 'code',
                            label: '订单编号',
                            type: 'input',
                            overHidden: true,
                            minWidth: 60,
                            search: true,
                        },
                        {
                            prop: 'totalPrice',
                            label: '订单总价',
                            type: 'input',
                            overHidden: true,
                            minWidth: 60,
                        },
                        {
                            prop: 'receipt',
                            label: '收件人',
                            type: 'input',
                            overHidden: true,
                            minWidth: 60,
                        },
                        {
                            prop: 'receiptPhone',
                            label: '联系方式',
                            type: 'input',
                            overHidden: true,
                            minWidth: 60,
                        },
                        {
                            prop: 'deliveryDate',
                            label: '送达日期',
                            type: 'input',
                            overHidden: true,
                            minWidth: 60,
                        },
                        {
                            prop: 'state',
                            label: '状态',
                            type: 'input',
                            overHidden: true,
                            minWidth: 60,
                            dicUrl: "/common/getItem/order_state",
                        },
                    ]
                },
                //弹框显示判断
                dialogVisible: false,
                //出发地
                start:null,


            }
        },
        mounted(){
            this.init();
        },
        methods:{


            //查看路线
            routeView(row){
                let end={
                    lng:row.lng,
                    lat:row.lat,
                    address:row.shippingAddress,
                }
                this.$refs.route.openDia(this.start,end);
            },

            //初始化
            init(){
                this.$HttpService.get("/info-merchants/findByMe").then(res=>{
                    this.start={
                        lng:res.lng,
                        lat:res.lat,
                        address:res.address,
                    };
                })
            },

            //开始配送
            startDelivery(id){
                this.$confirm('是否确认开始配送?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(res=>{
                    this.$HttpService.post("/info-order/updateState/"+id+"/02").then(res=>{
                        this.$message.success('操作成功！');
                        this.getList();
                    })
                })
            },

            //确认送达
            deliveryOk(id){
                this.$confirm('是否确认送达?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(res=>{
                    this.$HttpService.post("/info-order/updateState/"+id+"/03").then(res=>{
                        this.$message.success('操作成功！');
                        this.getList();
                    })
                })
            }
        }
    }
</script>

<style scoped lang="scss">

</style>
